<!--  -->
<template>
  <wd-popup
    v-model="popupVisible"
    position="bottom"
    custom-style="border-radius: 16rpx;"
    :z-index="9999"
  >
    <view class="share">
      <view
        ><button class="w-full bg-[transparent]" style="line-height: 1.5" open-type="share"
          >分享给朋友</button
        ></view
      >
      <view @click="toSave">保存到相册并分享</view>
      <view @click="popupVisible = false">取消</view>
    </view>
  </wd-popup>
</template>

<script lang="ts" setup>
  import { ref } from 'vue';
  import { navigateTo } from '@/utils/router';

  const popupVisible = ref(false);

  const toSave = () => {
    navigateTo('/pages-sub/share/index');
  };

  const show = () => {
    popupVisible.value = true;
  };
  defineExpose({
    show,
  });
</script>

<style lang="scss" scoped>
  .share {
    padding-bottom: 72rpx;
    font-size: 34rpx;
    color: #191919;
    & > view {
      padding: 32rpx 0;
      text-align: center;
      border-bottom: 2rpx solid rgba($color: #000000, $alpha: 0.1);
      &:last-child {
        border-bottom: none;
        border-top: 16rpx solid #f2f2f2;
      }
    }
  }
</style>
